<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>宠物信息表</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<link rel="stylesheet" href="css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
	
	
	<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
	<link href="js/select2/select2.min.css" type="text/css" rel="stylesheet" />
	<script src="js/select2/select2.min.js"></script>
	
	<style type="text/css">
	input {
		border: 1px solid #ace;
		border-radius: 5px;
		height: 25px;
	}
	
	td {
		padding: 5px;
	}
	
	.td_l {
		text-align: center;
		padding-left: 20px;
		width: 120px;
	}
	.td_c_l {
		text-align: center;
		padding-left: 20px;
		width: 120px;
	}
	
	.td_r {
		width: 300px;
	}
	
	#text_input {
		width: 200px;
	}
	
	.end_sub {
		margin-left: 40%;
	}
	</style>
</head>

<body>

	
	<!-- 表单开始 -->
		<form class="cmxform" id="commentForm" method="post" action="">
		
		<div class="panel panel-default">
			<div class="panel-heading">
				<h5 class="panel-title">宠物信息</h5>
			</div>
			<div class="panel-body ">
				<table>
					<tr>
						
						<td class="td_l">房号</td> 
						<td class="td_r"> 
						<input class="input-text " type="text" name="fkroomId" id="fkroomId" style="display: none" value="${room.id }"/> 
						<input class="input-text " type="text" name="roomNum" id="roomNum" value="${room.roomNumber }">
						</td>
						<td class="td_l">客户</td> 
						<td class="td_r"> 
						<input class="input-text radius"  type="text" name="fkcustomerId" id="fkcustomerId" /> 
						<%-- <select class="js-example-basic" style="width: 290px" name="fkcustomerId" id="fkcustomerId"  >
	 						<c:forEach var="Infos" items="${projectInfos}">
			                   	<option value="${Infos.id}">${Infos.projectName }</option>
						  	</c:forEach> 
			 			</select> --%>
							</td>
						</td>
						<td></td>
						<td></td>
					</tr>
					<tr>
						<td class="td_l">宠物类型</td> <td class="td_r"> 
							<select class="js-example-basic" style="width: 290px" name="petType" id="petType"  >
				   				<option value="" >请选择</option>
				   				<option value="dog" >狗</option>
				   				<option value="cat" >猫</option>
				 						<%-- <c:forEach var="Infos" items="${projectInfos}">
				                   	<option value="${Infos.id}">${Infos.projectName }</option>
							  	</c:forEach> --%>
				 						</select>
							</td>
							 <td class="td_l">宠物名称</td> <td class="td_r"> 
							<input type="text" class="input-text radius"  name="petName" id="petName" /> <span style="color:red;"></td>
							 <td class="td_l">宠物颜色</td> <td class="td_r"> 
							<input type="text" class="input-text radius"  name="petColor" id="petColor" /> <td style="color:red;"></td>
					</tr>
					<tr>
						<td class="td_l" colspan="4" style="padding-left: 0">
							<!-- 附件上传 -->
							<%@include file="../../p_utilePage/Article.jsp" %>
						</td>
						<td></td>
						<td></td>
					</tr>
					
				</table>
			</div>
			<!-- 专项申报 -->
		</div>

		<div style="text-align: center;">
			<!-- 提交按钮 -->
			<button class="btn btn-primary radius" onclick="saveDocument()"> 保 存</button>
				&nbsp; 
			<a class="btn btn-default radius" onclick="self.location=document.referrer;"> 取 消 </a>
		</div>
		</form>
		<!-- 表单结束 -->
		<script type="text/javascript">
		 $(function(){
		 	$(".js-example-basic").select2({
			  	placeholder: "请选择!",
			  	allowClear: true
			});
		 })
		 	function saveDocument(){
			var fkroomId=$("#fkroomId").val();
			var fkcustomerId=$("#fkcustomerId").val();
			var petType=$("#petType").val();
			var petName=$("#petName").val();
			var petColor=$("#petColor").val();
			var AccessoryCaList=$("#AccessoryCaList").val();
			var url="pet/addPet";
			$.ajax({
			    type:"post",
			    async:false,
			    url:url,
		        dataType:"json",
		        data:{
		        	fkroomId:fkroomId,
		        	fkcustomerId:fkcustomerId,
		        	petType:petType,
		        	petName:petName,
		        	petColor:petColor,
		        	AccessoryCaList:AccessoryCaList
		        },
			    success:function(responseText){
			        if(responseText.success){
						window.parent.gridObj_1.refreshPage();
			        	window.parent.layer.msg('保存成功！');
			        	closeLayer();
	    			}else{
	    				alert(responseText.msg, {icon: 7});
	    			}
			    }
	   		});
		}
		</script>
</body>
</html>
